<template>
  <view class="" style="padding: 20rpx">
    <view class="user_avatar">
      <u-avatar :src="src" size="62" />
      <view class="user_name">
        <text>{{ userInfo.name }}</text>
        <text>{{ userInfo.phone }}</text>
      </view>
      <uni-icons type="right" size="25" style="margin-left: auto" />
    </view>
    <view class="user_seting">
      <view
        v-for="(item, index) in setData"
        :key="index"
        @click="userSeting(item, index)"
      >
        <view class="setItem">
          <u--image
            :showLoading="true"
            :src="src"
            width="60rpx"
            height="60rpx"
            shape="circle"
          />
          <text>{{ item.name }}</text>
        </view>
        <uni-icons type="right" size="25" style="margin-left: auto" />
      </view>
    </view>
    <Tabbar cureentPage="mine"></Tabbar>
  </view>
</template>

<script>
import Tabbar from "@/common/tabbar/tabbar.vue";
import { mapGetters } from "vuex";
export default {
  data() {
    return {
      src: "https://img0.baidu.com/it/u=123020064,1503144048&fm=253",
      setData: [
        {
          name: this.$t("mine.MyProfile"),
        },
        {
          name: this.$t("mine.MyOrders"),
        },
        {
          name: this.$t("mine.SetUp"),
        },
      ],
    };
  },
  components: {
    Tabbar,
  },
  computed: {
    ...mapGetters(["locales",'userInfo']),
  },
  onShow() {
    uni.setNavigationBarTitle({
      title: this.$t("common.ItSMine"),
    });
  },
  methods: {
    userSeting(item, index) {
      let _this = this;
      switch (index) {
        case 0:
          uni.showToast({
            title: "待开发",
            duration: 2000,
            icon: "none",
          });
          break;
        case 1:
          _this.pickUp();
          break;
        case 2:
          uni.navigateTo({
            url: "/pages/subpackage/mine/setMine",
          });
          break;
      }
    },
    pickUp() {
      let _this = this;
      uni.showModal({
        title: _this.$t("common.Prompt"),
        cancelText: _this.$t("common.HandleCancel"),
        confirmText: _this.$t("common.HandleSure"),
        editable: true,
        placeholderText: _this.$t("common.PleaseEnter"),
        content: "4535183",
        success: function (res) {
          if (res.confirm && res.content) {
            uni.navigateTo({
              url: "/pages/subpackage/mine/orderMine?self_code=" + res.content,
            });
            console.log(res, "用户点击确定");
          } else if (res.cancel) {
            console.log("用户点击取消");
          } else {
            _this.showToast(_this.$t("common.PleaseEnter"));
            return;
          }
        },
      });
    },
    showToast(title) {
      uni.showToast({
        icon: "none",
        title: title,
      });
    },
  },
};
</script>

<style lang="scss" scoped>
.user_avatar {
  display: flex;
  align-items: center;
  gap: 20rpx;
  padding: 20rpx 0;
}

.user_name {
  display: flex;
  flex-direction: column;
  gap: 20rpx;
}

.user_seting {
  padding: 20rpx 0;
  display: flex;
  flex-direction: column;
  gap: 20rpx;
  // margin-top: 100rpx;

  > view {
    display: flex;
    border-bottom: 1px solid #eee;
    padding: 20rpx 0;
  }
}

.setItem {
  display: flex;
  align-items: center;
  gap: 20rpx;
}
</style>
<style>
</style>